import { useState, useEffect } from "react";
import axios from "axios";
import { Button, Table } from "antd";

const App = () => {
    const [data, setData] = useState([])

    const getlist = async () => {
        const res = await axios.get(`http://localhost:3000/users/list`)
        setData(res.data.data)
    }

    useEffect(() => { getlist(); }, [])

    const columns = [
        { title: "位置", dataIndex: "title" },
        { title: "运行", dataIndex: "looking" },
        {
            title: "状态",
            dataIndex: "status",
            key: "status",
            render: (status: any) =>
                <Button color={status ? "primary" : "default"} variant="filled">
                    {status ? "显示" : "隐藏"}
                </Button>
        },
        {title:"操作",render:()=>(
            <div>
                <Button>编辑</Button>
                <Button>删除</Button>
            </div>
        )}
    ]

    return (
        <>
            <Table rowKey="_id" dataSource={data} columns={columns} />
        </>
    )
}

export default App